<template>
  <div>
    {{getCountdown}}
  </div>
</template>

<script setup lang="ts">
import dayjs from "dayjs";
import { computed } from "vue";
const props = defineProps({
  item: {
    type: Object,
    default: () => { }
  }
})


const getCountdown = computed(() => {
  // 创建一个 Day.js 对象来表示 2024-03-28 16:20:38
  const targetDate = dayjs(props.item.makingACountdown);

  // 计算三天后的日期
  const futureDate = targetDate.add(3, 'day');

  // 获取当前日期和时间
  const now = dayjs();

  // 计算两个日期之间的差值（毫秒）
  const diffInMilliseconds = futureDate.diff(now);
  const diffInDays = Math.floor(diffInMilliseconds / (1000 * 60 * 60 * 24));
  const diffInHours = Math.floor((diffInMilliseconds % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  const diffInMinutes = Math.floor((diffInMilliseconds % (1000 * 60 * 60)) / (1000 * 60));
  const diffInSeconds = Math.floor((diffInMilliseconds % (1000 * 60)) / 1000);


  // console.log(diffInDays, diffInHours, diffInMinutes)

  if (diffInDays < 0 && diffInHours < 0 && diffInMinutes < 0) {
    return `(超时)${diffInDays}天${diffInHours}时${diffInMinutes}分`;
  } else {
    return `(剩)${diffInDays}天${diffInHours}时${diffInMinutes}分`
  }

})

</script>

<style lang="scss" scoped></style>
